<template>
  <Dialog v-model="dialogVisible" :title="dialogTitle" width="60%">
    <el-form
      ref="formRef"
      v-loading="formLoading"
      :model="formData"
      label-width="155px"
    >
      <el-form-item label="图书名称" prop="name">
        <el-input disabled v-model="formData.name"/>
      </el-form-item>
      <el-form-item label="章节名称" prop="title">
        <el-input disabled v-model="formData.title"/>
      </el-form-item>
      <el-form-item label="正文" prop="content">
        <el-input disabled v-model="formData.content" type="textarea" :autosize="{ minRows: 2, maxRows: 6 }"/>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>
<script lang="ts" setup>
import {reactive, ref} from 'vue'
import * as DebrisAPI from '@/api/debris'
import {useRouter, useRoute} from 'vue-router'
import * as NotifyTemplateApi from "@/api/system/notify/template";
import {CommonStatusEnum} from "@/utils/constants";

defineOptions({name: 'DerbrisDetail'})
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型
const formData = ref<DebrisAPI.BookDebrisPageReqVO>()
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (row: NotifyTemplateApi.NotifyTemplateVO) => {
  dialogVisible.value = true
  formData.value = row;
}
defineExpose({open}) // 提供 open 方法，用于打开弹窗

</script>
